<!--
  - Copyright (c) 2023.
  -
  - 作者：bmy
  - 邮箱：2271608011@qq.com
  - gitee：https://gitee.com/bmycode
  - github：https://github.com/helpcode
  -
  -->

<script lang="ts">
  import { onMount } from "svelte";
  import Layout from '@/component/layout.svelte';
  import { RadioGroup, TextInput } from '@svelteuidev/core';
  import config from "@/config";
  import { themeConfig } from '@/stores/ThemeStore';
  import JsonDatabase from "@/utils/JsonDatabase";

  let AutoSaveSelect = String($themeConfig.autoSave);

  let SavePathSelect = $themeConfig.savePath
  let SaveFileNameSelect = $themeConfig.saveFileName

  onMount(() => {

  });

</script>

<div class="storage">
    <Layout text="存储设置">

        <RadioGroup
                label="自动存储: "
                description="开启后 生成的代码 将自动存储到你指定的 路径"
                direction="column"
                labelDirection="left"
                items={config.offOrOnList()}
                bind:value={AutoSaveSelect}
                on:change={() => {
                   $themeConfig.autoSave = Number(AutoSaveSelect)
                   JsonDatabase.writeJson($themeConfig)
        }}/>

        <TextInput
                label="存储路径: "
                bind:value={SavePathSelect}
                description="路径需要为 磁盘上的  绝对路径！"
                styles:width="200px"
                on:change={(e) => {
                  $themeConfig.savePath = SavePathSelect
                  JsonDatabase.writeJson($themeConfig)
              }}>
        </TextInput>

        <TextInput
                label="文件名称: "
                description="保存到磁盘的 ts 文件名称，不需要后缀！"
                bind:value={SaveFileNameSelect}
                on:change={(e) => {
                  $themeConfig.saveFileName = SaveFileNameSelect
                  JsonDatabase.writeJson($themeConfig)
              }}>
        </TextInput>


    </Layout>
</div>

<style lang="less">
  .storage {
  }
</style>